
<!DOCTYPE html>
<html lang="en">
<head>
    <title>index</title>
<link rel="stylesheet" href="{{ url_for('blue_auth.static', filename='css/bootstrap.min-3.3.7.css') }}">

<script src="{{ url_for('blue_auth.static', filename='js/jquery.min-2.1.1.js') }}"></script>


<script src="{{ url_for('blue_auth.static', filename='js/bootstrap.min-3.3.7.js') }}"></script>
{#   <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">#}
{#   <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>#}
{#   <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>#}

</head>
<body>.
<div class="container-box">
   <div class="row" >
		<div class="col-xs-2">
			<img alt="40x40" src="{{ url_for('blue_auth.static', filename='images/a.jpg') }}" class="img-circle" />
		</div>
		<div class="col-xs-10">
			<h3 class="text-center">
				这是一套可视化布局系统.
			</h3>
		</div>
   </div>
</div>

<div class="row">
		<div class="col-xs-2">
			<ul class="nav nav-list">
				<li class="nav-header">
					列表标题
				</li>
				<li class="active">
					<a href="#">首页</a>
				</li>
				<li>
					<a href="#">库</a>
				</li>
				<li>
					<a href="#">应用</a>
				</li>
				<li class="nav-header">
					功能列表
				</li>
				<li>
					<a href="#">资料</a>
				</li>
				<li>
					<a href="#">设置</a>
				</li>
				<li class="divider">
				</li>
				<li>
					<a href="#">帮助</a>
				</li>
			</ul>
		</div>
		<div class="col-xs-10">

			<table class="table">
				<thead>
					<tr>
						<th>
							编号
						</th>
						<th>
							产品
						</th>
						<th>
							交付时间
						</th>
						<th>
							状态
						</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>
							1
						</td>
						<td>
							TB - Monthly
						</td>
						<td>
							01/04/2012
						</td>
						<td>
							Default
						</td>
					</tr>
					<tr class="success">
						<td>
							1
						</td>
						<td>
							TB - Monthly
						</td>
						<td>
							01/04/2012
						</td>
						<td>
							Approved
						</td>
					</tr>
					<tr class="error">
						<td>
							2
						</td>
						<td>
							TB - Monthly
						</td>
						<td>
							02/04/2012
						</td>
						<td>
							Declined
						</td>
					</tr>
					<tr class="warning">
						<td>
							3
						</td>
						<td>
							TB - Monthly
						</td>
						<td>
							03/04/2012
						</td>
						<td>
							Pending
						</td>
					</tr>
					<tr class="info">
						<td>
							4
						</td>
						<td>
							TB - Monthly
						</td>
						<td>
							04/04/2012
						</td>
						<td>
							Call in to confirm
						</td>
					</tr>
				</tbody>
			</table>
		</div>
</div>

</body>
</html>